<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>注册登录</title>
    <link rel="stylesheet" href="./css/login.css">
    <script src="./js/jquery.min.js"></script>
    <style>

    </style>
</head>

<body>
    <!-- 注册模块 -->
    <div class="login lg">
        <div class="login_logo"><img src="./image/m.png" alt=""></div>
        <h1>注册小米账号</h1>
        <div class="regbox">
            <div class="regbox_hd">
                <p>国家/地区</p>
                <!-- <input type="text"> -->
                <div class="int">
                    <span id="spn">中国</span>
                    <select name="" id="sel">
                        <option value=""></option>
                        <option value="中国">中国</option>
                    <option value="美国">美国</option>
                    <option value="日本">日本</option>
                </select>
                </div>
                <p>成功注册账号后,国家/地区将不能被修改</p>
            </div>
            <div class="regbox_bd">
                <p>手机号码</p>
                <input type="text" id="int">
                <span class="sp1">1313</span>
                <span class="sp3">此手机号以注册</span>
                <span class="sp2" id="sp2"><img src="./image/错误.png" alt="" > 手机号码不正确</span>
            </div>
            <div class="regbox_bd">
                <p>密码</p>
                <input type="password" id="pass" value="">
            </div>
            <a href="javascript:;" id="btn">立即注册</a>
        </div>
        <div class="regbox_fd">
            <p>已阅读并同意：小米<span>用户协议</span>和<span>隐私政策</span></p>
        </div>
    </div>
    <!-- 登录模块 -->
    <div class="footer">
        <div class="footer_hd">
            <a href="javascript:;">简体</a><span></span>
            <a href="javascript:;">繁体</a><span></span>
            <a href="javascript:;">English</a><span></span>
            <a href="javascript:;">常见问题</a>
        </div>
        <p>小米公司版权所有-京ICP备10046444- <a href="javascript:;">京公网安备11010802020134号</a>
            <a href="javascript:;">-京ICP证110507号</a>
        </p>
    </div>
</body>
<script>
    var sel = document.getElementById('sel')
        // console.log(sel.value)
    var pass = document.getElementById('pass')
    var login = document.getElementById('int')
    var btn = document.getElementById('btn')
    var sp2 = document.getElementById('sp2')
    var sp1 = document.querySelector('.sp1')
    var span = document.getElementById('spn')
    var sp3 = document.querySelector('.sp3')
    var sl
    $('#sel').change(function() {
        s1 = $(this).children('option:selected').val()
            //  console.log(se)
            //$('#spn').text() = se
            // console.log($('#spn').text())
        span.innerHTML = s1
        sel.style.color = 'transparent'
        console.log(sel)
        $(this).children('option:selected').color = '#333'
    })

    login.onblur = function() {
        sp3.style.display = 'none'
            // console.log(login.value)
        sl = this.value
        var params = `?shouji=${this.value}&appkey=e6e222c0b651e2a2`
            //     fetch('https://api.jisuapi.com/shouji/query' + params, {
            //         method: 'post',
            //         mode: 'no-cors',
            //         headers: {
            //             'Content-Type': 'application/json'
            //                 // "Content-type": "application:/x-www-form-urlencoded;charset=UTF-8"
            //         },
            //         // body: `?shouji=${this.value}&appkey=e6e222c0b651e2a2`
            //     }).then(res => {
            //         console.log(res)
            //         return res.json()
            //     }).then((data) => {
            //         console.log(data)
            //     })
        if (!(/^1[3456789]\d{9}$/.test(login.value))) {
            sp2.style.display = 'block'
            sp1.style.display = 'none'
        } else {
            $.ajax({
                url: 'https://api.jisuapi.com/shouji/query',
                dataType: 'jsonp',
                type: 'get',
                data: {
                    shouji: this.value,
                    appkey: 'e6e222c0b651e2a2'
                },
                success(data) {
                    //  console.log(data)
                    if (data.result.city) {
                        sp2.style.display = 'none'
                        sp1.style.display = 'block'
                        sp1.innerHTML = data.result.province + data.result.city + data.result.company
                    }
                    //  console.log(sp1.innerHTML)
                }
            })
        }
        fetch('http://dbyxs.xyz:3005/getuser', {
            method: 'POST',
            headers: {
                "Content-type": "application/json;charset=UTF-8"
            },
            body: JSON.stringify({
                user: this.value
            })
        }).then(res => {
            return res.json()
        }).then(res => {
            if (res.err_code == 200) {
                sp3.style.display = 'block'
                return
            } else {

            }
        })
    }
    var lo = document.getElementById('int').val
    console.log(lo)
    btn.addEventListener('click', function() {
        //   console.log(sl, pass.value)
        // var params = {
        //     user: sl,
        //     password: pass.value
        // }
        console.log(`user=${sl}&password=${pass.value}`)
        if (pass.value.trim() == '') {
            return alert('请输入密码')
        }
        fetch('http://dbyxs.xyz:3005/user', {
            method: 'POST',
            headers: {
                "Content-type": "application/json;charset=UTF-8"
            },
            //   body: JSON.parse(`user=${sl}&password=${pass.value}`)
            body: JSON.stringify({
                user: sl,
                password: pass.value
            })
        }).then(res => {
            return res.json()
        }).then(res => {
            window.sessionStorage.setItem('token', res.jwt)
            window.localStorage.setItem('mi', res.jwt)
            window.sessionStorage.setItem('users', sl)
            location.href = './index.html'

        })
    })
</script>

</html>